<template>
	<view>

		<view class="margin-sm">
			<view class=" padding-sm radius bg-pink">
				<p>
					以下情况 订单将以预定时间开始
				</p>
				<p>
					1、您预定的房间 在您预定的时间结束后紧跟着有其它订单
				</p>
				<p>
					2、如果要按预定时间开始，我们将通过公众号提前通知您
				</p>
				<p>
					其它
				</p>
				<p>
					1、预定成功 我们有权拒绝退款。但是会有响应补偿
				</p>
			</view>
			<view class="bg-white radius padding-sm margin-top-sm">

				<storeItem :data="info.sysOrgModel"></storeItem>


			</view>



			<view class="menu-list bg-white radius  margin-top-sm">
				<view class="list-cell radius" @click="">
					<view class="menu-item-box">
						<view>开始时间</view>
						<view class="text-right">{{info.startTime||""}}</view>
					</view>
				</view>
				<view class="list-cell radius" @click="">
					<view class="menu-item-box">
						<view>结束时间</view>
						<view class="text-right">{{info.endTime||""}}</view>
					</view>
				</view>
				<view class="list-cell radius" @click="">
					<view class="menu-item-box">
						<view>共计时长</view>
						<view class="text-right">{{info.hourNumber||"0"}}小时</view>
					</view>
				</view>
			</view>

			<!-- 使用劵 -->
			<view class="menu-list bg-white radius  margin-top-sm">
				<view class="list-cell radius" @click="">
					<view class="menu-item-box">
						<view>订单金额</view>
						<view class="text-right font-34rpx" style="color: #ff6145;font-weight: bold;">
							{{info.price||"0"}}元
						</view>
					</view>
				</view>
				<view class="list-cell radius" @click="signDiscountCoupons">
					<view class="menu-item-box">
						<view>优惠劵/验卷</view>

						<view class="text-right" style="display: flex;">
							<text style="color: #ff6145;">-110</text>
							<view class="cuIcon-right margin-left-xs"></view>
						</view>
					</view>
				</view>
				<view class="list-cell radius" @click="">
					<view class="menu-item-box">

						<view>余额支付</view>
						<view class="text-right">2022-10-20</view>
					</view>
				</view>
				<view class="list-cell radius" @click="">
					<view class="menu-item-box">
						<view>微信支付</view>
						<view class="text-right">2小时</view>
					</view>
				</view>
			</view>


			<view class="menu-list  radius  margin-top-sm padding-sm juzhong font-content" @click="call">
				有疑问请联系商家<view class="cuIcon-phone"></view>
			</view>


			<!-- <uni-section title="为您推荐套餐" type="circle" class="bg-white radius ">
				<view class="padding-sm">123</view>
			</uni-section> -->
		</view>
		<view style="width: 100%;position: fixed;bottom: 0px;background-color: #fff;padding: 20rpx;" class="d3d">
			<view style="display: flex;">
				<view style="width: 600rpx;">
					<view style="color: #ff6145;">共计:
						<text class="font-34rpx" style="font-weight: bold;">{{info.price||"0"}}</text>
						元
					</view>
					<view class="font-content">时长:{{info.hourNumber||"0"}}小时</view>
				</view>
				<button @click="reservation" class="login-btn cu-btn block bg-pink lg round " style="width: 100%;">
					确认预约
				</button>
			</view>

		</view>

		<signDiscountCoupons ref="signDiscountCoupons"></signDiscountCoupons>
	</view>
</template>

<script>
	import {
		getLocation
	} from "@/utils/map"
	import {
		getById,
		reservation
	} from "@/api/shop/userorder/SysUserOrderManagementApi.js"
	export default {
		data() {
			return {
				form: {

				},
				info: {}
			}
		},
		onLoad(e) {
			this.form.id = e.id

			this.init()
		},
		onShow() {

		},
		methods: {
			init() {
				this.getById()
			},
			call() {

			},

			//确认预约
			async reservation() {
				let _this = this
				uni.showModal({
					title: '预约提示',
					content: '您正在操作预约,请确认',
					success: function(res) {
						if (res.confirm) {
							_this.reservation2()
						} else if (res.cancel) {
							return
							console.log('用户点击取消');
						}
					}
				});
			},
			//确认预约 第二步
			async reservation2() {
				let {
					data,
					msg,
					code
				} = await reservation(this.info)
				if (code == 0) {
					uni.showModal({
						title: msg,
						content: '可前往订单页查看与分享',
						success: function(res) {
							if (res.confirm) {
								uni.switchTab({
									url: "/pages/order/order"
								})

							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
				} else {
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
			},


			/**
			 * 查询订单详情
			 */
			async getById() {
				let asdf = await getLocation()
				this.form.lat = asdf.latitude
				this.form.lon = asdf.longitude
				let {
					data
				} = await getById(this.form)
				this.info = data
			},
			signDiscountCoupons() {
				this.$refs.signDiscountCoupons.open()
			},

		}
	}
</script>

<style>

</style>